/*
 * @Description: 高级搜索- 搜索范围组件
 * @Author: Rfan
 * @Date: 2022-01-23 16:00:50
 * @LastEditTime: 2023-02-25 19:17:08
 */

import { fetchRepoList } from '@/api/archivesType';
import { Select } from 'antd';
import { useEffect, useState } from 'react';
import { useAdvanceContext } from '../contexts/AdvanceContext';
import ScopeItem from './ScopeItem';
// import classNames from 'classnames/bind';

// import styles from './scopeSelect.module.scss';

// const cx = classNames.bind(styles);

const ScopeMain = () => {
  const { scopeList, setDbName } = useAdvanceContext();
  console.log('scopeMain', scopeList);
  const [dbNameList, setDbNameList] = useState([]);
  /* 选取dbName */
  useEffect(() => {
    fetchRepoList({ atType: 1 }).then((res: any) => {
      const { data } = res;
      setDbNameList(data);
    });
  }, []);
  const changeDbName = (eve: any) => {
    setDbName(eve);
  };
  return (
    <>
      <p>范围选择</p>
      <Select
        className="select-before"
        style={{ width: 120 }}
        defaultValue="data"
        options={dbNameList}
        fieldNames={{ label: 'description', value: 'name' }}
        onChange={changeDbName}
      />
      {scopeList.map((item: any) => (
        <ScopeItem key={item.id} info={item} />
      ))}
      <hr />
    </>
  );
};

export default ScopeMain;
